<template>
  <view class="root_view">
    <view class="content_view">
      <image class="iv_logo" mode="aspectFit" src="/static/img/ic_spd_144.png" ></image>
      <view class="iput_pan">
        <!-- 密码登录 -->
        <view class="iput_pss_pan" v-if="panid==0">
          <input
            class="iput_telphone"
            placeholder-class="ipt_placeholder_style"
            placeholder="请输入手机号"
          >
          
          <input
            class="iput_password_login"
            placeholder-class="ipt_placeholder_style"
            placeholder="请输入密码"
          >
        </view>

        <!-- 验证码登录 -->
        <view v-if="panid==1" style="iput_pan">
          <van-cell-group custom-class="iput_vercode_pan">
            <van-field
         
              :value="username"
              label="用户名"
              placeholder="请输入用户名"
              border="true "
              required="true"
              @change="onChange1"
            />
            <van-field
         
              :value="password"
              type="password"
              label="密码"
              @change="onChange2"
              placeholder="请输入密码"
              required="true"
              border="true"
            />
          </van-cell-group>
        </view>
      </view>
      <view class="tv_click">
        <text class="tv_vcode" @tap="vcodelogin">验证码登录</text>

        <text class="tv_forget_psswd" @tap="resetpswd">忘记密码</text>
      </view>

      <button class="btn_login" :disabled="isDisposed" @tap="login">登录</button>
    </view>
  </view>
</template>

<script>
import { $wuxCalendar, $wuxSelect } from "../../../static/wux/index";
import {get} from '@/utils/util'

export default {
 
  computed: {
   
  },
   onShow() {
      console.log("-------------1---------------")
      console.log( "onCreat is start"+getApp().globalData.userInfo.openId)
     //wx.hideTabBar();
  },
  data() {
    return {
      username: "",
      password: "",
      isLoaded: false,
      isDisposed: true,
      navigation_title: "登录",
      is_back: true,
      iv_path: "../../static/images/detail_back.png",
      panid: 1
    };
  },
  methods: {

    login(e) {
      //JSESSIONID=ABDF18CC16CB6E9AE7ECF2A376928C58;
      console.log(e);
      const info = await get('weChatAction/webLogin.do', {id: this.bookid})
      let url = "/static/pages/menu/index";
      wx.navigateTo({ url });
    },
    onChange1(e){
      const result = e.mp.detail;
      this.username = result;
      console.log(result);
      result.length == 0 ? (this.isDisposed = true) : (this.isDisposed = false);
    },
    onChange2(e){
      const result = e.mp.detail;
      this.password = result;
      console.log(result);
      result.length == 0 ? (this.isDisposed = true) : (this.isDisposed = false);
    }
  }
};
</script>

<style >
.iv_logo {
  width: 234rpx;
  height: 90rpx;
  margin-top: 60rpx;
  margin-left: 250rpx;
}
.iput_pss_pan {
  width: 650rpx;
  height: 234rpx;
  margin-top: 68rpx;
  padding-left: 30rpx;
}

.iput_vercode_pan {
  width: 650rpx;
  margin-left: 30rpx;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 68rpx;
  border: 1px solid gray;
}

.iput_telphone {
  width: 650rpx;
  height: 94rpx;
  background-color: #f0f0f0;
  border-radius: 10rpx;
  padding-left: 50rpx;
}

.iput_telphone2 {
  width: 650rpx;
  height: 94rpx;
  background-color: gray;
  border-radius: 10rpx;
  padding-left: 50rpx;
  margin-left: 30rpx;
}
.iput_password_login {
  padding-left: 50rpx;
  margin-top: 40rpx;
  width: 650rpx;
  height: 94rpx;
  background-color: #f0f0f0;
  border-radius: 10rpx;
}

.rl_vcode_view {
  display: flex;
  flex-direction: row;
  width: 100%;
  height: 94rpx;
}
.tv_get_vcode {
  margin-top: 42rpx;
  text-align: center;
  font-size: 32rpx;
  width: 200rpx;
  height: 64rpx;
  margin-left: 37rpx;
  background-color: #cdd9f8;
  border-radius: 10rpx;
  padding-top: 20rpx;
  color: #4b77e5;
}
.iput_vcode_login {
  padding-left: 50rpx;
  margin-top: 40rpx;
  width: 410rpx;
  height: 94rpx;
  background-color: #f0f0f0;
  border-radius: 10rpx;
  margin-left: 30rpx;
}

.ipt_placeholder_style {
  font-size: 32rpx;
}

.tv_click {
  width: 630rpx;
  height: 60rpx;
  padding-left: 60rpx;
  margin-top: 50rpx;
}

.tv_vcode {
  width: 50%;
  height: 100%;
  text-align: left;
  font-size: 30rpx;
  color: #666666;
}

.tv_forget_psswd {
  width: 50%;
  height: 100%;
  text-align: right;
  font-size: 30rpx;
  color: #666666;
  margin-left: 349rpx;
}

.btn_login {
  width: 690rpx;
  height: 94rpx;
  background-color: #4b77e5;
  margin-left: 30rpx;
  margin-right: 30rpx;
  margin-top: 67rpx;
  bottom: 0%;
  color: #ffffff;
  border-radius: 10rpx;
}
</style>
